import { gameHelper } from "../../cccframework/Utils/GameHelpler";


const { ccclass, property } = cc._decorator;

@ccclass
export default class DotProduct extends cc.Component {

    @property(cc.Node)
    origin: cc.Node = null;
    @property(cc.Slider)
    scaleX: cc.Slider = null;
    @property(cc.Slider)
    scaleY: cc.Slider = null;
    @property(cc.Slider)
    rotation: cc.Slider = null;
    @property(cc.Slider)
    skewX: cc.Slider = null;
    @property(cc.Slider)
    skewY: cc.Slider = null;

    onLoad() {
        console.log(cc.AffineTransform.create(1, 0, 0, 1, 0, 0))
    }

    getNodeRect(node: cc.Node): cc.Vec2[] {
        let points = [
            cc.v2(-node.width / 2, node.height / 2),
            cc.v2(node.width / 2, node.height / 2),
            cc.v2(node.width / 2, -node.height / 2),
            cc.v2(-node.width / 2, -node.height / 2),
        ]
        let affine = this.finalTransform(node);
        // console.log('affine',affine)
        for (let i = 0; i < points.length; i++) {
            points[i] = cc.v2(
                points[i].x * affine.a + points[i].y * affine.c + affine.tx,
                points[i].x * affine.b + points[i].y * affine.d + affine.ty,
            )
        }
        points.forEach(v => {
            // v.x = (v.x * affine.a + v.y * affine.c);
            // v.y = (v.x * affine.b + v.y * affine.d);
            // v.x += affine.tx
            // v.y += affine.ty
        })
        return points;
    }
    finalTransform(node: cc.Node): AffineTransform {
        // 缩放
        let angle = node.angle;
        let radian = -angle * Math.PI / 180;
        let normal = new AffineTransform(1, 0, 0, 1, 0, 0)
        let scale = new AffineTransform(
            node.scaleX,
            0,
            0,
            node.scaleY,
            0, 0
        )
        // 旋转
        let rotate = new AffineTransform(
            Math.cos(radian),
            -Math.sin(radian),
            Math.sin(radian),
            Math.cos(radian),
            0, 0
        )
        // 剪切
        let shear = new AffineTransform(
            1,
            Math.tan(node.skewY * Math.PI / 180),
            Math.tan(node.skewX * Math.PI / 180),
            1,
            0, 0
        )
        // 平移
        let position = new AffineTransform(1, 0, 0, 1, node.x, node.y)

        // return rotate.concat(position);
        return normal
            .concat(shear)
            .concat(scale)
            .concat(rotate)
            .concat(position);
    }

    renderRect(rect: cc.Vec2[]) {
        gameHelper.clearDraw()
        gameHelper.drawAny(null, rect.concat(rect[0]))
    }

    update() {
        this.origin.scaleX = (this.scaleX.progress - 0.5) * 3;
        this.origin.scaleY = (this.scaleY.progress - 0.5) * 3;
        this.origin.angle = this.rotation.progress * 360;
        this.origin.skewX = (this.skewX.progress - 0.5) * 360;
        this.origin.skewY = (this.skewY.progress - 0.5) * 360;
        this.renderRect(this.getNodeRect(this.origin))
    }
}

class AffineTransform {
    a: number;
    b: number;
    c: number;
    d: number;
    tx: number;
    ty: number;
    constructor(a: number, b: number, c: number, d: number, tx: number, ty: number) {
        this.a = a;
        this.b = b;
        this.c = c;
        this.d = d;
        this.tx = tx;
        this.ty = ty;
    }
    // [a, b
    //  c, d ]
    concat(affine: AffineTransform): AffineTransform {
        return new AffineTransform(
            this.a * affine.a + this.b * affine.c,
            this.a * affine.b + this.b * affine.d,
            this.c * affine.a + this.d * affine.c,
            this.c * affine.b + this.d * affine.d,
            this.tx + affine.tx,
            this.tx + affine.ty,
        )
    }
}
